Skip to content

setDeviceOrientation

setDeviceOrientation 함수는 기기의 화면 방향을 설정하는 기능을 제공해요. 이 기능은 특정 화면에서 가로 모드나 세로 모드를 강제로 지정해야 할 때 유용해요.

type 옵션을 통해 원하는 화면 방향을 지정할 수 있어요. 특히, 이 함수는 앱 전체에 영향을 미치므로 특정 화면에서만 사용하려면 화면을 벗어날 때 이전 상태로 복구하는 추가 작업이 필요해요.

예를 들어, 동영상 감상 화면에서는 가로 모드를 강제하고, 화면을 떠날 때 설정을 복구해서 다른 화면들의 방향 설정에 영향을 주지 않도록 할 수 있어요.

시그니처

typescript
function setDeviceOrientation(options: {
    type: 'portrait' | 'landscape';
}): Promise<void>;

파라미터

  • options필수 · object

    화면 방향 설정 값이에요.

    • options.type필수 · string

      화면 방향을 지정하는 옵션이에요.

'portrait' | 'landscape' 중 하나를 선택할 수 있어요.

반환 값

  • Promise<void>

    화면 방향 설정이 완료되면 해결되는 Promise를 반환해요.

예제

화면 방향 설정하기

tsx
import { Button } from 'react-native';
import { setDeviceOrientation } from '@apps-in-toss/framework';

function SetDeviceOrientation() {
  return (
    <Button
      title="가로 모드로 변경"
      onPress={() => {
        setDeviceOrientation({ type: 'landscape' });
      }}
    />
  );
}

화면 방향 복구하기

특정 화면을 벗어날 때 이전 상태로 복구하려면 다음과 같이 useEffect를 사용하세요.

tsx
import { useEffect } from 'react';
import { setDeviceOrientation } from '@apps-in-toss/framework';

function VideoScreen() {
  useEffect(() => {
    setDeviceOrientation({ type: 'landscape' });

    return () => {
      setDeviceOrientation({ type: 'portrait' }); // 설정을 이전 상태로 복구해요.
    };
  }, []);

  return <Text>동영상을 감상하는 화면</Text>;
}